Coding Schools

Basic Structure of HTML
HTML 5 Features
IFrame in HTML
HTML - div and span tags
HTML - marquee element
HTML - List elements
HTML - paragraph element
HTML - table elements

IFrame in HTML

An iframe (Inline Frame) in HTML is used to embed another HTML document within the current document. This can be useful for displaying content from another website, such as videos, maps, or documents. Here' how you can use it:

Basic Syntax

The basic syntax of an iframe is:

html

<iframe src="URL" width="width" height="height"></iframe>

src: Specifies the URL of the page to embed.
width and height: Define the dimensions of the iframe.

Example

Here' an example of embedding a YouTube video using an iframe:

html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Iframe Example</title>
</head>
<body>

<h1>Embedding a YouTube Video</h1>
<iframe src="https://www.youtube.com/embed/VIDEO_ID" width="560" height="315" frameborder="0" allowfullscreen></iframe>

</body>
</html>

In this example, replace VIDEO_ID with the actual ID of the YouTube video you want to embed.

Additional Attributes

Here are some additional attributes you might find useful:

frameborder: Specifies whether or not to display a border around the iframe (value can be 0 or 1).
allowfullscreen: Allows the iframe to be displayed in fullscreen mode.
sandbox: Provides an extra layer of security by restricting what the embedded content can do (e.g., allow-scripts, allow-forms).
name: Specifies a name for the iframe. This can be used as the target attribute for links or forms.
allow: Allows specifying what features are allowed in the iframe (e.g., autoplay, camera, microphone).

Example with Additional Attributes

Here' an example with more attributes:

html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Iframe Example</title>
</head>
<body>

<h1>Embedding a YouTube Video with Additional Attributes</h1>
<iframe
  src="https://www.youtube.com/embed/VIDEO_ID"
  width="560"
  height="315"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
  allowfullscreen
></iframe>

</body>
</html>

In this example, the allow attribute is used to specify what features are allowed in the iframe.

Using iframes can be very powerful, but be aware of the potential security and performance implications, especially when embedding content from third-party websites.

Feel free to ask if you have more questions or need further clarification on any part of this